@import "cslntouch-normalize.css";
@import "cslntouch-swiper.min.css";
@import "cslntouch-font-awesome.css";
%oneline {
  overflow-x: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

$color1:#ffb900;
$color2:#ff8c00;
$color3:#f7630c;
$color4:#ca5010;
$color5:#da3b01;
$color6:#ef6950;
$color7:#d13438;
$color8:#ff4343;
$color9:#e74856;
$color10:#e81123;
$color11:#ea005e;
$color12:#c30052;
$color13:#e3008c;
$color14:#bf0077;
$color15:#c239b3;
$color16:#9a0089;
$color17:#0078d7;
$color18:#0063b1;
$color19:#8e8cd8;
$color20:#6b69d6;
$color21:#8764b8;
$color22:#744da9;
$color23:#b146c2;
$color24:#881798;
$color25:#0099bc;
$color26:#2d7d9a;
$color27:#00b7c3;
$color28:#038387;
$color29:#00b294;
$color30:#018574;
$color31:#00cc6a;
$color32:#10893e;
$color33:#7a7574;
$color34:#5d5a58;
$color35:#68768a;
$color36:#515c6b;
$color37:#567c73;
$color38:#486860;
$color39:#498205;
$color40:#107c10;
$color41:#767676;
$color42:#4c4a48;
$color43:#69797e;
$color44:#4a5459;
$color45:#647c64;
$color46:#525e54;
$color47:#847545;
$color48:#7e735f;
i {
  display: none!important;
}

.search i {
  display: block !important;
}

header h1,
#maincontent .button .newbooks-button,
#maincontent .button .readerlogin-button,
#maincontent .button .userInfo-button,
#maincontent .button .readerinf-button,
.swiper-slide .rebooks figcaption,
.booklist .timing,
.booklist .rightinf div:nth-of-type(1),
.booklist .rightinf div:nth-of-type(2),
.newsframe ul a span {
  overflow-x: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

body {
  font-family: "Microsoft Yahei";
}

body input,
body button {
  font-family: "Microsoft Yahei";
}

body a {
  text-decoration: none;
}


/* my colors */

.bg {
//  background-image: url(../img/cslntouch-bg06.jpg);
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  width: 100vw;
  height: 100vh;
  //  background-color: $color2;
  overflow-y: auto;
  overflow-x: hidden;
}

header {
  width: 100%;
  position: fixed;
  z-index: 998;
  top: 0;
}

header h1 {
  text-align: left;
  text-indent: 1em;
  margin: 0;
  font-size: 2.5em;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
}

.article h1 {
  padding: 10px 0;
}

.message-news,
.message-information {
  position: fixed;
  top: 20vh;
}

.message-news a,
.message-information a {
  color: white;
  font-size: 2em;
  margin: auto;
  height: 200px;
  width: 100px;
  padding: 10px;
  box-sizing: border-box;
  text-align: center;
  max-resolution: res;
  display: table-cell;
  vertical-align: middle;
  //  border: 2px solid white;
  //  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.message-news i,
.message-information i {
  //  display: none;
}

.message-news p,
.message-information p {
  margin: 0;
}

.message-news {
  left: 0;
}

.message-news a {
  background: $color12;
}

.message-news a:active {}

.message-information {
  right: 0;
}

.message-information a {
  background: $color40;
}

.message-information a:active {}

.headernormal {
  background: $color5;
  color: white;
}

.headerlogin {
  background-color: #135f93;
  color: white;
}

#maincontent {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100vw;
  height: 100vh;
}

#maincontent .wrapper {
  margin: 16vh auto 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: column nowrap;
  -ms-flex-flow: column nowrap;
  flex-flow: column nowrap;
  width: 70vw;
}

#maincontent .search {
  background: $color34;
  text-align: center;
  padding: 10px;
  box-sizing: border-box;
  width: 100%;
  //  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.75);
  position: relative;
}

#maincontent .search form {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 0 2vw;
}

#maincontent .search input,
#maincontent .search button {
  font-size: 2.3em;
  padding: 10px;
  outline: none;
  border: none;
  line-height: 1.4;
}

#maincontent .search input {
  -webkit-box-flex: 1;
  -webkit-flex: 1 75%;
  -ms-flex: 1 75%;
  flex: 1 75%;
  border-radius: .25em;
}

#maincontent .search button {
  -webkit-box-flex: 1;
  -webkit-flex: 1 20%;
  -ms-flex: 1 20%;
  flex: 1 20%;
  box-sizing: border-box;
  background: none;
  color: white;
  cursor: pointer;
}

#maincontent .search button:active {
  background-color: rgba(255, 255, 255, 0.3);
}

#maincontent .button {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: 20px;
}

#maincontent .button .newbooks,
#maincontent .button .readerlogin,
#maincontent .button .reader {
  width: 49%;
  text-align: center;
  color: black;
  font-size: 3em;
  box-sizing: border-box;
  //  border: 5px solid white;
  //  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.75);
  font-weight: 500;
}

#maincontent .button .newbooks-button,
#maincontent .button .readerlogin-button,
#maincontent .button .userInfo-button,
#maincontent .button .readerinf-button {
  display: block;
  //  width: 100%;
  padding: 50px 0;
  cursor: pointer;
  color: white;
  //  background-color: white;
}

#maincontent .button .newbooks-button {
  background: $color2;
}

#maincontent .button .newbooks-button:active {}

#maincontent .button .readerlogin-button,
#maincontent .button .userInfo-button,
#maincontent .button .readerinf-button {
  background: $color17;
}

#maincontent .button .readerlogin-button:active,
#maincontent .button .userInfo-button:active,
#maincontent .button .readerinf-button:active {
  background-image: -webkit-linear-gradient(top, #7ecefd, rgba(126, 206, 253, 0.2));
  background-image: linear-gradient(to bottom, #7ecefd, rgba(126, 206, 253, 0.2));
}

#maincontent .recommendedbooks {
  width: 100%;
  margin-top: 20px;
}

#maincontent .recommendedbooks .outer {
  background: white;
}

#maincontent .recommendedbooks h2 {
  font-size: 2em;
  text-align: center;
  margin: 0;
  padding: 10px 0;
  background: $color47;
  color: white;
}

#maincontent .recommendedbooks .allbooks a {
  text-align: center;
  font-size: 1.4em;
  display: block;
  color: white;
  padding: 15px 0;
  letter-spacing: 1em;
  box-sizing: border-box;
  font-weight: 500;
  background: $color47;
  //  border-top: 2px solid $color47;
}

#maincontent .recommendedbooks .allbooks a:active {}


/* 登录框 */

.readerlogin-form {
  display: none;
}

.readerlogin-form .mask {
  display: none;
  position: fixed;
  z-index: 997;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.7);
}

.readerlogin-form .error {
  position: fixed;
  color: red;
  z-index: 999;
  left: 0;
  text-align: center;
  width: 100%;
  top: 50%;
  margin-top: -300px;
  padding: 0;
  font-size: 0.8em;
  font-weight: 600;
}

.readerlogin-form .form {
  position: fixed;
  z-index: 999;
  border-radius: 10px;
  width: 820px;
  height: 430px;
  left: 50%;
  top: 50%;
  margin-top: -215px;
  margin-left: -425px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  background-image: url(../img/cslntouch-login.png);
  background-size: cover;
  background-repeat: no-repeat;
}

.readerlogin-form form {
  margin-top: 70px;
  margin-right: 40px;
  width: 60%;
  position: relative;
}

.readerlogin-form form p {
  margin: 30px 0 0 0;
}

.readerlogin-form form p:last-child {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.readerlogin-form form input {
  padding: 10px;
  font-size: 0.8em;
  outline: none;
  border: none;
  width: 100%;
  box-sizing: border-box;
  //  border: 1px solid lightgray;
  line-height: 1.4;
  border-radius: .25em;
}

.readerlogin-form form button {
  background: $color18;
  border: 1px solid white;
  //  border:none;
  outline: none;
  font-size: 0.8em;
  padding: 15px 0;
  box-sizing: border-box;
  cursor: pointer;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  color: white;
  border-radius: .25em;
}

.readerlogin-form form button:active {}

.readerlogin-form form button[type=reset] {
  margin-right: 20px;
}

.readerlogin-form form #close {
  position: absolute;
  top: -80px;
  right: -60px;
  border-radius: 100%;
  font-size: 0.7em;
  width: 80px;
  height: 80px;
  &:after {
    content: "X";
  }
}


/* 新书推荐滚动 */

.swiper-container {
  height: 280px;
}

.swiper-wrapper {
  position: relative;
}

.swiper-slide {
  margin: 0;
  padding: 0;
}

.swiper-slide .rebooks {
  width: 300px;
  padding: 20px;
}

.swiper-slide .rebooks .img {
  width: 154px;
  height: 154px;
  font-size: 0;
  text-align: center;
  border: 2px solid lightgray;
  box-sizing: border-box;
  box-shadow: 1px 1px 5px rgba(128, 128, 128, 0.6);
  background-color: white;
  margin: 0 auto;
}

.swiper-slide .rebooks .img a {
  width: 154px;
  height: 154px;
  display: inline-block;
}

.swiper-slide .rebooks img {
  max-height: 150px;
  max-width: 150px;
}

.swiper-slide .rebooks figcaption {
  font-size: 1.5em;
  width: 300px;
  padding: 10px 20px;
  box-sizing: border-box;
  text-align: center;
}

.details {
  position: absolute;
  z-index: 9999;
  top: 5px;
  left: 50%;
  margin-left: -28%;
  display: none;
  width: 80%;
  color: white;
  background: $color29;
  padding: 10px;
  font-size: 1.3em;
  box-sizing: border-box;
  //  border: 2px solid white;
  box-shadow: 1px 1px 3px gray inset, 1px 1px 3px gray;
  max-height: 274px;
  overflow: hidden;
}

.details ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.details ul li {
  padding: 1px;
  font-family: "宋体";
  font-weight: bold;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
}

.details ul li:before {
  font-family: FontAwesome;
  display: inline-block;
  text-align: center;
  padding-right: 10px;
  width: 1em;
  font-weight: normal;
}

.details ul li:nth-of-type(1):before {
  content: "\f02d\ ";
}

.details ul li:nth-of-type(4):before {
  content: "\f040\ ";
}

.details ul li:nth-of-type(2):before {
  content: "\f022\ ";
}

.details ul li:nth-of-type(3):before {
  content: "\f0f7\ ";
}

footer {
  position: fixed;
  top: 1.2em;
  right: 14px;
  z-index: 9999;
  background:rgba(255,255,255,.8);
  padding:5px 10px;
  border-radius:1em;
}

footer .company {
  font-size: .8em;
//  color: rgba(255, 255, 255, .7);
}

footer img {
  display: inline-block;
  height: 1.2em;
  margin-right: 0.5em;
  vertical-align: middle;
}


/*-----------------login----------------*/

.exit {
  width: 100%;
  box-sizing: border-box;
  position: fixed;
  z-index: 998;
  top: 128px;
  text-align: right;
  padding-right: 2em;
}

.exit .autotime {
  color: #b64926;
  font-size: 1.3em;
  display: inline-block;
}

.exit .autotime span {
  font-weight: bold;
}

.scrollarea {
  height: 100%;
  width: 85vw;
  overflow-y: auto;
}

.readerpage {
  position: relative;
  margin-bottom: 200px;
  width: 70vw;
}

.readerpage>* {
  margin-bottom: 100px;
}

.readerpage .readerpage-reader {
  font-size: 1.7em;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
}

.readerpage .readerpage-reader table {
  width: 100%;
  border-collapse: collapse;
  background-color: rgba(255, 255, 255, 0.5);
}

.readerpage .readerpage-reader td {
  border: 2px solid lightgray;
  padding: 10px;
}

.readerpage .readerpage-reader td:nth-of-type(odd) {
  width: 4.5em;
  background-color: rgba(126, 206, 253, 0.2);
}

.readerpage .readerpage-reader td:nth-of-type(even) {
  width: 20%;
}

.readerpage .readerpage-changepassword .readerpage-changepassword-header,
.readerpage .notreturnbooks .notreturnbooks-header,
.readerpage .booksrecord .notreturnbooks-header,
.readerpage .paymentrecord .notreturnbooks-header,
.readerpage .orderbooks .orderbooks-header,
.readerpage .booksrecord .booksrecord-header,
.readerpage .paymentrecord .paymentrecordheader {
  font-size: 2em;
  text-align: center;
  padding: 10px 0;
  box-sizing: border-box;
  background-color: rgba(126, 206, 253, 0.8);
}

.readerpage .notreturnbooks table,
.readerpage .booksrecord table,
.readerpage .paymentrecord table,
.readerpage .orderbooks table {
  font-size: 1.7em;
  width: 100%;
  border-collapse: collapse;
  background-color: rgba(255, 255, 255, 0.5);
}

.readerpage .notreturnbooks td,
.readerpage .booksrecord td,
.readerpage .paymentrecord td,
.readerpage .orderbooks td {
  padding: 10px 5px;
}

.readerpage .notreturnbooks th,
.readerpage .booksrecord th,
.readerpage .paymentrecord th,
.readerpage .orderbooks th {
  padding: 10px 5px;
}

.readerpage .notreturnbooks th:first-child,
.readerpage .booksrecord th:first-child,
.readerpage .paymentrecord th:first-child,
.readerpage .orderbooks th:first-child {
  text-align: left;
}

.readerpage .notreturnbooks tbody,
.readerpage .booksrecord tbody,
.readerpage .paymentrecord tbody,
.readerpage .orderbooks tbody {
  font-family: "宋体";
}

.readerpage .notreturnbooks tbody tr:nth-of-type(odd),
.readerpage .booksrecord tbody tr:nth-of-type(odd),
.readerpage .paymentrecord tbody tr:nth-of-type(odd),
.readerpage .orderbooks tbody tr:nth-of-type(odd) {
  background-color: rgba(126, 206, 253, 0.3);
}

.readerpage .readerpage-changepassword {
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
}

.readerpage .readerpage-changepassword form {
  font-size: 2em;
  padding: 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row wrap;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  background-color: rgba(255, 255, 255, 0.5);
}

.readerpage .readerpage-changepassword form input,
.readerpage .readerpage-changepassword form button {
  outline: none;
  border: none;
}

.readerpage .readerpage-changepassword form input {
  padding: 10px;
  text-align: center;
  margin: 20px 0;
  border: 2px solid lightgray;
  box-sizing: border-box;
}

.readerpage .readerpage-changepassword form button {
  width: 20%;
  margin-top: 20px;
  padding: 20px;
  background-image: -webkit-linear-gradient(bottom, #7ecefd, rgba(126, 206, 253, 0.4));
  background-image: linear-gradient(to top, #7ecefd, rgba(126, 206, 253, 0.4));
  border-radius: 10px;
  border: 3px solid white;
  cursor: pointer;
}

.readerpage .readerpage-changepassword form button:active {
  background-image: -webkit-linear-gradient(top, #7ecefd, rgba(126, 206, 253, 0.4));
  background-image: linear-gradient(to bottom, #7ecefd, rgba(126, 206, 253, 0.4));
}

.readerpage .booksrecord table tbody tr td:first-child,
.readerpage .notreturnbooks table tbody tr td:first-child {
  font-size: 1.1em;
}

.readerpage .notreturnbooks,
.readerpage .booksrecord,
.readerpage .paymentrecord {
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
}

.readerpage .notreturnbooks th:nth-of-type(2),
.readerpage .booksrecord th:nth-of-type(2),
.readerpage .paymentrecord th:nth-of-type(2) {
  text-align: left;
}

.readerpage .notreturnbooks td:nth-of-type(3),
.readerpage .notreturnbooks td:nth-of-type(4),
.readerpage .booksrecord td:nth-of-type(3),
.readerpage .booksrecord td:nth-of-type(4),
.readerpage .paymentrecord td:nth-of-type(3),
.readerpage .paymentrecord td:nth-of-type(4) {
  text-align: center;
}

.readerpage .notreturnbooks td:last-child,
.readerpage .booksrecord td:last-child,
.readerpage .paymentrecord td:last-child {
  text-align: right;
}

.readerpage .notreturnbooks td:first-child,
.readerpage .booksrecord td:first-child,
.readerpage .paymentrecord td:first-child {
  width: 45%;
}

.readerpage .notreturnbooks span,
.readerpage .booksrecord span,
.readerpage .paymentrecord span {
  vertical-align: middle;
}

.readerpage .notreturnbooks button,
.readerpage .booksrecord button,
.readerpage .paymentrecord button {
  outline: none;
  border: none;
  border-radius: 100%;
  margin-left: 20px;
  width: 80px;
  height: 80px;
  background-image: -webkit-linear-gradient(bottom, #135f93, rgba(126, 206, 253, 0.6));
  background-image: linear-gradient(to top, #135f93, rgba(126, 206, 253, 0.6));
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
  border: 2px solid white;
  color: white;
  font-size: 0.8em;
  vertical-align: middle;
}

.readerpage .notreturnbooks button:active,
.readerpage .booksrecord button:active,
.readerpage .paymentrecord button:active {
  background-image: -webkit-linear-gradient(top, #135f93, rgba(126, 206, 253, 0.6));
  background-image: linear-gradient(to bottom, #135f93, rgba(126, 206, 253, 0.6));
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5) inset;
}

.readerpage .paymentrecord td:first-child {
  width: inherit;
}

.readerpage .orderbooks {
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
}

.readerpage .orderbooks td:last-child {
  text-align: right;
}

.readerpage .orderbooks th:nth-of-type(2) {
  text-align: left;
}

.readerpage .orderbooks button {
  outline: none;
  border: none;
  border-radius: 5px;
  margin-left: 20px;
  width: 80px;
  height: 80px;
  background-image: -webkit-linear-gradient(bottom, #135f93, rgba(126, 206, 253, 0.6));
  background-image: linear-gradient(to top, #135f93, rgba(126, 206, 253, 0.6));
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
  border: 2px solid white;
  color: white;
  font-size: 0.8em;
  vertical-align: middle;
}

.readerpage .orderbooks button:active {
  background-image: -webkit-linear-gradient(top, #135f93, rgba(126, 206, 253, 0.6));
  background-image: linear-gradient(to bottom, #135f93, rgba(126, 206, 253, 0.6));
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5) inset;
}

.readerpage .booksrecord td:last-child {
  text-align: center;
}

.readerpage .booksrecord th:nth-of-type(2) {
  text-align: left;
}

.readerpage .paymentrecord td:nth-of-type(2) {
  text-align: center;
}

.readerpage .paymentrecord th:nth-of-type(2) {
  text-align: center;
}

.readerpage .paymentrecord td:nth-of-type(3),
.readerpage .paymentrecord th:nth-of-type(3) {
  text-align: left;
}

.readerpage .paymentrecord td:nth-of-type(4),
.readerpage .paymentrecord th:nth-of-type(4) {
  text-align: right;
}

.readerpage .paymentrecord td:nth-of-type(5) {
  text-align: center;
}


/*-------------searchbook--------------*/

.bookwrap {
  width: 85vw;
  overflow: hidden;
}

.booklist {
  width: 100%;
  height: 70vh;
  overflow-y: auto;
  padding: 2em 0 0 0;
}

.booklist .onebook {
  width: 70vw;
  box-sizing: border-box;
  font-size: 1.8em;
}

.booklist .bookblock {
  overflow: hidden;
  margin-bottom: 2%;
}

.booklist .timing {
  width: 100%;
  font-size: 1em;
  font-weight: bold;
  font-family: "宋体";
  border-left: 20px solid #8e2800;
  border-bottom: 1px solid #8e2800;
  text-align: left;
  padding-left: 0.5em;
}

.booklist .leftinf {
  width: 30%;
  float: left;
  font-size: 0.74em;
  font-family: "楷体";
  font-weight: bold;
}

.booklist .leftinf .smaller {
  font-size: 0.9em;
  font-family: "宋体";
  font-weight: normal;
}

.booklist .leftinf div:nth-of-type(1),
.booklist .leftinf div:nth-of-type(2) {
  text-align: left;
  padding-left: 3em;
}

.booklist .leftinf div:nth-of-type(3),
.booklist .leftinf div:nth-of-type(4),
.booklist .leftinf div:nth-of-type(5) {
  text-align: left;
  padding-left: 3em;
}

.booklist .leftinf div:nth-of-type(5) {
  width: 320%;
}

.booklist .rightinf {
  width: 70%;
  float: left;
  font-size: 0.74em;
  font-family: "宋体";
  font-weight: bold;
}

.booklist .rightinf .smaller {
  font-size: 0.9em;
  font-family: "宋体";
  font-weight: normal;
}

.booklist .rightinf div:nth-of-type(1),
.booklist .rightinf div:nth-of-type(2) {
  text-align: left;
  padding-left: 2em;
  font-size: 1.1em;
}

.booklist .rightinf div:nth-of-type(3),
.booklist .rightinf div:nth-of-type(4) {
  text-align: left;
  padding-left: 2em;
  font-family: "楷体";
}

.booklist .rightinf div:nth-of-type(5) {
  width: 0;
}

.booklist .rightinf div {
  border-bottom: 1px solid lightgray;
  height: 3.5vh;
  line-height: 3.5vh;
}

.booklist .leftinf div {
  text-align: right;
  border-bottom: 1px solid lightgray;
  height: 3.5vh;
  line-height: 3.5vh;
}

.booklist .bookblock .leftinf div:nth-child(even) {
  background: rgba(255, 255, 255, 0.7);
}

.booklist .bookblock .leftinf div:nth-child(odd) {
  background: rgba(255, 255, 255, 0.2);
}

.booklist .bookblock .rightinf div:nth-child(even) {
  background: rgba(255, 255, 255, 0.7);
}

.booklist .bookblock .rightinf div:nth-child(odd) {
  background: rgba(255, 255, 255, 0.2);
}


/*--------------return--------------*/

.return {
  position: fixed;
  right: 40px;
  top: 40%;
  margin-top: -125px;
  -webkit-animation: returnanimation .5s ease;
  animation: returnanimation .5s ease;
}

@-webkit-keyframes returnanimation {
  from {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
  }
  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
  }
}

@keyframes returnanimation {
  from {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
  }
  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
  }
}

.return .colorblue {
  background-image: -webkit-linear-gradient(bottom, #135f93, rgba(126, 206, 253, 0.8));
  background-image: linear-gradient(to top, #135f93, rgba(126, 206, 253, 0.8));
}

.return .colorblue:active {
  background-image: -webkit-linear-gradient(top, #135f93, rgba(126, 206, 253, 0.8));
  background-image: linear-gradient(to bottom, #135f93, rgba(126, 206, 253, 0.8));
}

.return .colororange {
  color: black;
  background-image: -webkit-linear-gradient(bottom, #fd7400, rgba(253, 116, 0, 0.3));
  background-image: linear-gradient(to top, #fd7400, rgba(253, 116, 0, 0.3));
}

.return .colororange:active {
  background-image: -webkit-linear-gradient(top, #fd7400, rgba(253, 116, 0, 0.3));
  background-image: linear-gradient(to bottom, #fd7400, rgba(253, 116, 0, 0.3));
}

.return .colorred {
  background-image: -webkit-linear-gradient(bottom, #8e2800, rgba(142, 40, 0, 0.3));
  background-image: linear-gradient(to top, #8e2800, rgba(142, 40, 0, 0.3));
}

.return .colorred:active {
  background-image: -webkit-linear-gradient(top, #8e2800, rgba(142, 40, 0, 0.3));
  background-image: linear-gradient(to bottom, #8e2800, rgba(142, 40, 0, 0.3));
}

.return a {
  width: 120px;
  height: 250px;
  display: inline-block;
  font-size: 2.5em;
  background-image: -webkit-linear-gradient(bottom, #468966, rgba(70, 137, 102, 0.2));
  background-image: linear-gradient(to top, #468966, rgba(70, 137, 102, 0.2));
  background-color: white;
  text-align: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: column;
  -ms-flex-flow: column;
  flex-flow: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  color: white;
  border-radius: 10px;
  border: 2px solid white;
  font-weight: 600;
  box-shadow: 1px 0 3px rgba(0, 0, 0, 0.6);
}

.return a:active {
  background-image: -webkit-linear-gradient(top, #468966, rgba(70, 137, 102, 0.2));
  background-image: linear-gradient(to bottom, #468966, rgba(70, 137, 102, 0.2));
}

.return span {
  margin-top: 20px;
}


/*--------------userlogout--------------*/

.userlogout {
  position: fixed;
  right: 40px;
  top: 75%;
  margin-top: -125px;
  -webkit-animation: returnanimation .5s ease;
  animation: returnanimation .5s ease;
}

@-webkit-keyframes returnanimation {
  from {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
  }
  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
  }
}

@keyframes returnanimation {
  from {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
  }
  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
  }
}

.userlogout .colorblue {
  background-image: -webkit-linear-gradient(bottom, #135f93, rgba(126, 206, 253, 0.8));
  background-image: linear-gradient(to top, #135f93, rgba(126, 206, 253, 0.8));
}

.userlogout .colorblue:active {
  background-image: -webkit-linear-gradient(top, #135f93, rgba(126, 206, 253, 0.8));
  background-image: linear-gradient(to bottom, #135f93, rgba(126, 206, 253, 0.8));
}

.userlogout .colororange {
  color: black;
  background-image: -webkit-linear-gradient(bottom, #fd7400, rgba(253, 116, 0, 0.3));
  background-image: linear-gradient(to top, #fd7400, rgba(253, 116, 0, 0.3));
}

.userlogout .colororange:active {
  background-image: -webkit-linear-gradient(top, #fd7400, rgba(253, 116, 0, 0.3));
  background-image: linear-gradient(to bottom, #fd7400, rgba(253, 116, 0, 0.3));
}

.userlogout .colorred {
  background-image: -webkit-linear-gradient(bottom, #8e2800, rgba(142, 40, 0, 0.3));
  background-image: linear-gradient(to top, #8e2800, rgba(142, 40, 0, 0.3));
}

.userlogout .colorred:active {
  background-image: -webkit-linear-gradient(top, #8e2800, rgba(142, 40, 0, 0.3));
  background-image: linear-gradient(to bottom, #8e2800, rgba(142, 40, 0, 0.3));
}

.userlogout a {
  width: 120px;
  height: 250px;
  display: inline-block;
  font-size: 2.5em;
  background-image: -webkit-linear-gradient(bottom, #468966, rgba(70, 137, 102, 0.2));
  background-image: linear-gradient(to top, #468966, rgba(70, 137, 102, 0.2));
  background-color: white;
  text-align: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: column;
  -ms-flex-flow: column;
  flex-flow: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  color: white;
  border-radius: 10px;
  border: 2px solid white;
  font-weight: 600;
  box-shadow: 1px 0 3px rgba(0, 0, 0, 0.6);
}

.userlogout a:active {
  background-image: -webkit-linear-gradient(top, #468966, rgba(70, 137, 102, 0.2));
  background-image: linear-gradient(to bottom, #468966, rgba(70, 137, 102, 0.2));
}

.userlogout span {
  margin-top: 20px;
}

.return2 {
  position: fixed;
  z-index: 9999;
  left: 20px;
  bottom: 10px;
  -webkit-animation: returnanimation .5s ease;
  animation: returnanimation .5s ease;
}

@keyframes returnanimation {
  from {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
  }
  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
  }
}

.return2 .colorblue {
  background-image: -webkit-linear-gradient(bottom, #135f93, rgba(126, 206, 253, 0.8));
  background-image: linear-gradient(to top, #135f93, rgba(126, 206, 253, 0.8));
}

.return2 .colorblue:active {
  background-image: -webkit-linear-gradient(top, #135f93, rgba(126, 206, 253, 0.8));
  background-image: linear-gradient(to bottom, #135f93, rgba(126, 206, 253, 0.8));
}

.return2 .colororange {
  color: black;
  background-image: -webkit-linear-gradient(bottom, #fd7400, rgba(253, 116, 0, 0.3));
  background-image: linear-gradient(to top, #fd7400, rgba(253, 116, 0, 0.3));
}

.return2 .colororange:active {
  background-image: -webkit-linear-gradient(top, #fd7400, rgba(253, 116, 0, 0.3));
  background-image: linear-gradient(to bottom, #fd7400, rgba(253, 116, 0, 0.3));
}

.return2 .colorred {
  background-image: -webkit-linear-gradient(bottom, #8e2800, rgba(142, 40, 0, 0.3));
  background-image: linear-gradient(to top, #8e2800, rgba(142, 40, 0, 0.3));
}

.return2 .colorred:active {
  background-image: -webkit-linear-gradient(top, #8e2800, rgba(142, 40, 0, 0.3));
  background-image: linear-gradient(to bottom, #8e2800, rgba(142, 40, 0, 0.3));
}

.return2 a {
  width: 80px;
  height: 80px;
  display: inline-block;
  font-size: 1.2em;
  background-image: -webkit-linear-gradient(bottom, #468966, rgba(70, 137, 102, 0.2));
  background-image: linear-gradient(to top, #468966, rgba(70, 137, 102, 0.2));
  background-color: white;
  text-align: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: column;
  -ms-flex-flow: column;
  flex-flow: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  color: white;
  border-radius: 10px;
  border: 2px solid white;
  font-weight: 600;
  box-shadow: 1px 0 3px rgba(0, 0, 0, 0.6);
}

.return2 a:active {
  background-image: -webkit-linear-gradient(top, #468966, rgba(70, 137, 102, 0.2));
  background-image: linear-gradient(to bottom, #468966, rgba(70, 137, 102, 0.2));
}

.return2 a i {
  margin: 0;
  font-size: 1.5em;
}

.return2 a span {
  margin: 0;
}

.return2 span {
  margin-top: 20px;
}

.closearticle {
  position: fixed;
  z-index: 9999;
  left: 6.5%;
  bottom: 10px;
  -webkit-animation: returnanimation2 .5s ease;
  animation: returnanimation2 .5s ease;
}

@-webkit-keyframes returnanimation2 {
  from {
    -webkit-transform: rotateX(-90deg);
    transform: rotateX(-90deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
  }
  to {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
  }
}

@keyframes returnanimation2 {
  from {
    -webkit-transform: rotateX(-90deg);
    transform: rotateX(-90deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
  }
  to {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
  }
}

.closearticle .colorblue {
  background-image: -webkit-linear-gradient(bottom, #135f93, rgba(126, 206, 253, 0.8));
  background-image: linear-gradient(to top, #135f93, rgba(126, 206, 253, 0.8));
}

.closearticle .colorblue:active {
  background-image: -webkit-linear-gradient(top, #135f93, rgba(126, 206, 253, 0.8));
  background-image: linear-gradient(to bottom, #135f93, rgba(126, 206, 253, 0.8));
}

.closearticle .colororange {
  color: black;
  background-image: -webkit-linear-gradient(bottom, #fd7400, rgba(253, 116, 0, 0.3));
  background-image: linear-gradient(to top, #fd7400, rgba(253, 116, 0, 0.3));
}

.closearticle .colororange:active {
  background-image: -webkit-linear-gradient(top, #fd7400, rgba(253, 116, 0, 0.3));
  background-image: linear-gradient(to bottom, #fd7400, rgba(253, 116, 0, 0.3));
}

.closearticle .colorred {
  background-image: -webkit-linear-gradient(bottom, #8e2800, rgba(142, 40, 0, 0.3));
  background-image: linear-gradient(to top, #8e2800, rgba(142, 40, 0, 0.3));
}

.closearticle .colorred:active {
  background-image: -webkit-linear-gradient(top, #8e2800, rgba(142, 40, 0, 0.3));
  background-image: linear-gradient(to bottom, #8e2800, rgba(142, 40, 0, 0.3));
}

.closearticle a {
  width: 80px;
  height: 80px;
  display: inline-block;
  font-size: 1.2em;
  background-image: -webkit-linear-gradient(bottom, #468966, rgba(70, 137, 102, 0.2));
  background-image: linear-gradient(to top, #468966, rgba(70, 137, 102, 0.2));
  background-color: white;
  text-align: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: column;
  -ms-flex-flow: column;
  flex-flow: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  color: white;
  border-radius: 10px;
  border: 2px solid white;
  font-weight: 600;
  box-shadow: 1px 0 3px rgba(0, 0, 0, 0.6);
}

.closearticle a:active {
  background-image: -webkit-linear-gradient(top, #468966, rgba(70, 137, 102, 0.2));
  background-image: linear-gradient(to bottom, #468966, rgba(70, 137, 102, 0.2));
}

.closearticle a i {
  margin: 0;
  font-size: 1.5em;
}

.closearticle a span {
  margin: 0;
}

.closearticle span {
  margin-top: 20px;
}


/*-----------newbook--------------*/

.newbook {
  background-image: -webkit-linear-gradient(bottom, rgba(253, 116, 0, 0.9), rgba(253, 116, 0, 0.3));
  background-image: linear-gradient(to top, rgba(253, 116, 0, 0.9), rgba(253, 116, 0, 0.3));
  padding: 10px;
  box-sizing: border-box;
  width: 100%;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.75);
  position: relative;
  line-height: 1.4;
  border-radius: 5px;
}

.newbook form {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  font-size: 2.3em;
}

.newbook input,
.newbook button {
  padding: 10px;
  outline: none;
  border: none;
  line-height: 1.4;
}

.newbook h2 {
  -webkit-box-flex: 2;
  -webkit-flex: 2;
  -ms-flex: 2;
  flex: 2;
  font-size: 1em;
  margin: 0;
  padding: 10px;
  line-height: 1.4;
  text-align: center;
}

.newbook input {
  width: 5em;
  margin-left: 2em;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.newbook button {
  box-sizing: border-box;
  background: none;
  cursor: pointer;
  text-align: left;
  padding-left: 1em;
  -webkit-box-flex: 2;
  -webkit-flex: 2;
  -ms-flex: 2;
  flex: 2;
}

.newbook button:active {
  background-color: rgba(255, 255, 255, 0.3);
}


/* error */

.search .error,
.newbook .error {
  position: absolute;
  text-align: center;
  width: 100%;
  color: red;
  font-weight: 600;
  font-size: 1.5em;
  top: -1.3em;
  left: 0;
}

.readerpage .error {
  position: fixed;
  text-align: center;
  width: 100%;
  color: red;
  font-weight: 600;
  font-size: 1.3em;
  top: 128px;
  left: 0;
}

.shaodeng2 {
  position: fixed;
  width: 70vw;
  top: 50%;
  margin-top: -100px;
  text-align: center;
}

.shaodeng2 p {
  margin: auto;
  font-size: 2em;
  margin-bottom: 1em;
  font-weight: 600;
  color: #135f93;
  font-size: 3em;
  text-shadow: 1px 1px 3px grey;
}

.shaodeng2 p:before {
  content: "\f071 ";
  font-family: FontAwesome;
  display: inline-block;
  padding-right: 0.5em;
  vertical-align: middle;
}

.shaodeng {
  position: fixed;
  width: 200px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: column;
  -ms-flex-flow: column;
  flex-flow: column;
  left: 50%;
  top: 50%;
  margin-top: -100px;
  margin-left: -100px;
}

.shaodeng p {
  margin: auto;
  font-size: 2em;
  margin-bottom: 1em;
  font-weight: bold;
  color: #135f93;
  -webkit-animation: light 1s linear infinite;
  animation: light 1s linear infinite;
}

@-webkit-keyframes light {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes light {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

.shaodeng img {
  display: block;
  margin: auto;
  width: 100%;
  -webkit-animation: rotate 1.2s linear infinite;
  animation: rotate 1.2s linear infinite;
}

@-webkit-keyframes rotate {
  from {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes rotate {
  from {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


/* bookdetails */

.bookdetails {
  position: relative;
  margin-bottom: 200px;
  width: 70vw;
}

.bookdetails table {
  margin-bottom: 120px;
  font-size: 1.6em;
  border-collapse: collapse;
}

.bookdetails table img {
  width: 300px;
}

.bookdetails td {
  padding: 10px;
}

.bookdetails tr:nth-of-type(1) td:nth-of-type(2),
.bookdetails tr:nth-of-type(2) td:nth-of-type(1),
.bookdetails tr:nth-of-type(3) td:nth-of-type(1),
.bookdetails tr:nth-of-type(4) td:nth-of-type(1),
.bookdetails tr:nth-of-type(5) td:nth-of-type(1),
.bookdetails tr:nth-of-type(6) td {
  font-family: "楷体";
}

.bookdetails tr:nth-of-type(1) td:nth-of-type(3),
.bookdetails tr:nth-of-type(2) td:nth-of-type(2),
.bookdetails tr:nth-of-type(3) td:nth-of-type(2),
.bookdetails tr:nth-of-type(4) td:nth-of-type(2),
.bookdetails tr:nth-of-type(5) td:nth-of-type(2),
.bookdetails tr:nth-of-type(7) td {
  font-family: "宋体";
}

.bookdetails tr:nth-of-type(1) td:nth-of-type(2) {
  width: 15%;
}

.bookdetails tr:nth-of-type(1) td:nth-of-type(3) {
  width: 55%;
}

.bookdetails tr:nth-of-type(6) td {
  text-align: center;
  border-top: 2px solid lightgray;
  margin-top: 20px;
}

.bookdetails tr:last-child td {
  text-align: justify;
  text-indent: 2em;
  padding: 20px;
  padding-top: 0;
  line-height: 1.4;
}


/* newsframe 新闻 */

.listflex {
  width: 12%;
}

.listflex span:last-child {
  display: none;
}

.listnormal {
  width: 100%;
}

.newsframe ul {
  padding: 0;
  padding-bottom: 1vh;
  margin: 0;
  list-style: none;
  position: fixed;
  overflow-x: hidden;
  z-index: 999;
  top: 70px;
  left: 0;
  bottom: 110px;
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 1.2em;
  overflow-y: auto;
  background-color: white;
}

.newsframe ul li:nth-of-type(odd) {
  background-color: rgba(182, 73, 38, 0.1);
}

.newsframe ul a {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 20px 5px;
  color: black;
}

.newsframe ul a span {
  display: inline-block;
  overflow-y: hidden;
}

.newsframe ul a span:last-child {
  border-left: 1px solid #999;
  box-sizing: border-box;
  padding-left: 10px;
  width: 14vw;
}

.newsframe ul a span:first-child {
  width: 70vw;
}

.newsframe .texttitle {
  position: fixed;
  top: 80px;
  padding: 10px;
  color: white;
  background-image: -webkit-linear-gradient(bottom, rgba(142, 40, 0, 0.8), rgba(142, 40, 0, 0.3));
  background-image: linear-gradient(to top, rgba(142, 40, 0, 0.8), rgba(142, 40, 0, 0.3));
  box-sizing: border-box;
  border-radius: 5px;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
  width: 80vw;
}

.newsframe .texttitle h2 {
  margin: 0;
  padding: 0;
  font-size: 1.2em;
  overflow: hidden;
  display: table;
}

.newsframe .texttitle h2 span {
  display: table-cell;
  vertical-align: middle;
}

.newsframe .texttitle h2 span:last-child {
  width: 10vw;
  text-align: right;
}

.newsframe .texttitle h2 span:nth-of-type(1) {
  width: 74vw;
  padding-left: 1em;
}

.newsframe .textcontent {
  width: 80vw;
  margin-bottom: 5vh;
  padding-bottom: 120px;
}

.newsframe .textcontent2 {
  position: fixed;
  width: 70vw;
  top: 90px;
  bottom: 5vh;
  padding-right: 15vw;
  overflow-y: auto;
}

.touchbutton {
  width: 120px;
  text-align: center;
  color: white;
  background-color: #b64926;
  box-sizing: border-box;
  border: 1px solid white;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.75);
  font-weight: 500;
  border-radius: .25em;
  margin-left: 2em;
}


/*# sourceMappingURL=cslntouch-style.css.map */
